<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="content-type" content="text/html; charset=utf-8" />
		<title>
			不定高色块 float四个边脚实现
		</title>
		<style type="text/css">
/*<![CDATA[*/
		.box {
		background: #E4E4E1 none repeat scroll 0 0;
		}
		.box_t, .box_b {
		height: 8px;
		}
		.box sup.r {
		background-position: 0 -232px;
		}

		.box .r {
		float: right;
		}
		.box sup.l {
		background-position: -8px -232px;
		}

		.box .l {
		float: left;
		}
		.box sup, .box sub {
		background: transparent url(mix_nr.gif) no-repeat scroll 0 0;
		display: block;
		height: 8px;
		overflow: hidden;
		width: 8px;
		}
		.box sub.r {
		background-position: 0 -252px;
		}
		.box .r {
		float: right;
		}
		.box sub.l {
		background-position: -8px -252px;
		}

		.box .l {
		float: left;
		}
		p {
		margin: 0;
		padding: 0;
		padding: 10px;
		}
		/*]]>*/
		</style>
	</head>
	<body>
		<div class="box">
							<div class="box_t"><sup class="r"></sup><sup class="l"></sup></div>
							<div class="box_bd">
								<p>图片圆角色块</p>
								<p>使用4个sup和sub作为边脚，通过background-image布置圆角</p>
							</div>
							<div class="box_b"><sub class="r"></sub><sub class="l"></sub></div>
						</div>
	</body>
</html>
